<script setup>
import {Map,View} from 'ol';
import OSM from "ol/source/OSM";
import TileLayer from "ol/layer/Tile.js";
import {onMounted} from 'vue'
const initMap = () => {
  new Map({
    // 这里可以是ID 或者 元素对象
    target:'map',
    // 图层
    layers: [
      new TileLayer({
        source: new OSM()
      })
    ],
    view: new View({
      center: [113.24981689453125, 23.126468438108688], //视图中心位置
      projection:"EPSG:4326", //指定投影
      zoom: 18
    })
  })
}

onMounted(() => {
  initMap()
})

</script>

<template>
  <div id="map" class="map"></div>
</template>

<style scoped>
#map {
  width: 100%;
  height: 100%;
}
</style>